/*
 * @Author: Lin Hongwei
 * @Date: 2022-09-07 20:57:27
 * @LastEditTime: 2022-10-06 16:07:29
 * @LastEditors: Lin Hongwei
 * @email: 1365755396@qq.com
 * @CSDN: https://blog.csdn.net/weixin_45429409
 * @Description: 负责人查询组件（查看项目管理中负责人的名字）
 * - 通过name进行名称管理组名称
 * - 通过负责人id进行筛选
 */
import { List } from "./list";
import { SearchPanel } from "./search-panel";
import { useDebouce, useDocumentTitle, useMount } from "../../hooks";
import styled from "@emotion/styled";
import { useQueryProject } from "../../api/project";
import { useQueryUsers } from "../../api/users";
import { Button, Typography } from "antd";
import { useProjectModal, useProjectSearchParams } from "./util";
import { ButtonNoPadding, Row } from "../../components/lib";
import { ErrorBox } from "../../components/ErrorBox";
// export const ProjectList = (props: { projectButton: JSX.Element }) => {
export const ProjectList = () => {
  useDocumentTitle("项目列表", false);
  //筛选参数
  // const [param, setParam] = useState({
  //   personId: "", //负责人id
  //   name: "", //负责人name
  // });
  // const [, setParam] = useState({
  //   personId: "", //负责人id
  //   name: "", //负责人name
  // });
  //使用防抖处理输入框输入内容
  // const [param, setParam] = useUrlQueryParam(["name", "personId"]);
  // let debouceParam = useDebouce(param, 1000); //这里监听param，由于useUrlQueryParam返回的param都是新的，导致监听的导致死循环
  // const { data: list, isLoading, error } = useQueryProject(debouceParam); //封装的请求函数
  const [param, setParam] = useProjectSearchParams();
  // const {
  //   data: list,
  //   isLoading,
  //   error,
  //   retry,
  // } = useQueryProject(useDebouce(param, 1000)); //封装的请求函数
  const {
    data: list,
    isLoading,
    error,
  } = useQueryProject(useDebouce(param, 1000)); //封装的请求函数(改用react-query)
  //用户信息
  const { data: users } = useQueryUsers();

  // 使用参数管理modal状态
  const { open } = useProjectModal();
  return (
    <Contaniner>
      <PageHeader between={true}>
        <h1>项目列表</h1>
        {/* {props.projectButton} */}
        <ButtonNoPadding type="link" onClick={open}>
          创建项目
        </ButtonNoPadding>
      </PageHeader>
      <SearchPanel param={param} setParam={setParam} users={users || []} />
      {/* {error ? (
        <Typography.Text type="danger">{error.message}</Typography.Text>
      ) : null} */}
      <ErrorBox error={error} />
      {/* <List
        retry={retry}
        users={users || []}
        dataSource={list || []}
        loading={isLoading}
        projectButton={props.projectButton}
      /> */}
      <List users={users || []} dataSource={list || []} loading={isLoading} />
    </Contaniner>
  );
};
const Contaniner = styled.div`
  padding: 3.2rem;
`;
const PageHeader = styled(Row)``;
